<template>
  <view class="note">
    <view :class="['note-item',item.ReadTime > 0 ? 'read':''] " v-for="(item, index) in list" :key="index"
          @click="$goPage('/note/system/detail',{sid:item.Sid})">
      <view class="note-item_header u-flex">
        <view class="note-state">
          <text class="icon icon-tongzhi1"></text>
          <u-badge :is-dot="true" type="error" :offset="[-8,-8]"></u-badge>
        </view>
        <view class="u-flex note-item_title" v-if="item.BizType == 21">{{$t('chat.request_friend')}}</view>
        <view class="u-flex note-item_title" v-else-if="item.BizType == 22">{{$t('chat.request_friend_notify')}}</view>
        <view class="u-flex note-item_title" v-else>{{item.Title}}</view>
        <u-tag v-if="item.DealType == 2" :text="$t('chat.stat_ignored')" mode="plain" type="info" size="mini" />
        <u-tag v-if="item.DealType == 1" :text="$t('chat.stat_agreed')" mode="plain" type="success" size="mini" />
      </view>
      <view class="note-item_txt">
        <text v-if="item.BizType == 21">{{$t('chat.user_iam')}} </text>
        {{item.Content}}
        <text v-if="item.Title == $t('chat.request_friend_notify') && item.DealType == 2"> {{$t('chat.stat_ignored')}} </text>
        <text v-if="item.Title == $t('chat.request_friend_notify') && item.DealType == 1"> {{$t('chat.stat_agreed')}} </text>
      </view>
      <view class="note-item_time">{{item.AddTimeText}}</view>
    </view>
    <u-loadmore :status="status" :icon-type="iconType" :load-text="loadText" margin-bottom="45" margin-top="45"
                color="#C1C0C0" />

    <view class="more-action" v-if="isMore">
      <view class="more-action_item" @click="isReaded = true">{{$t('chat.btn_read_all')}}</view>
      <view class="more-action_item" @click="isDeleted = true">{{$t('chat.btn_del_all')}}</view>
    </view>
    <u-modal v-model="isReaded" :show-cancel-button="true" :show-title="false" :cancelText="$t('chat.btn_cancel')" :confirmText="$t('chat.btn_confirm')"
             :content="$t('chat.con_read')" @cancel="cancelModal" @confirm="actRead
		"></u-modal>
    <u-modal v-model="isDeleted" :show-cancel-button="true" :show-title="false" :cancelText="$t('chat.btn_cancel')" :confirmText="$t('chat.btn_confirm')"
             :content="$t('chat.con_del_notify')" @cancel="cancelModal" @confirm="actDelete"></u-modal>
  </view>
</template>

<script>
import pageMixin from '@/utils/pageMixin';
export default {
  mixins: [pageMixin],
  data() {
    return {
      msgType: 0,
      list: [],
      status: 'nomore',
      iconType: 'flower',
      loadText: {
        loadmore: this.$t('chat.pull_up'),
        loading: this.$t('chat.loading'),
        nomore: this.$t('chat.note_no_more'),
      },
      isMore: false,
      isReaded: false,
      isDeleted: false,
			notifyType: 0,
    }
  },
  onReady() {
		setTimeout(()=> {
			console.log(this.notifyType)
			if(this.notifyType == 0) {
						uni.setNavigationBarTitle({
						  title: this.$t('home.repair_confirm')
						});
					}else if(this.notifyType == 1){
						uni.setNavigationBarTitle({
						  title: this.$t('home.update_repair')
						});
					}else if(this.notifyType == 2) {
						uni.setNavigationBarTitle({
						  title: this.$t('home.bbs_notify')
					});
			  }
		},200)
	},			
  onLoad(option) {
		this.msgType = option.type || 0;
		this.notifyType = option.notifyType
  },
  onShow(option) {
    this.getList();
  },
	onNavigationBarButtonTap(e) {
		console.log(e)
	  if (e.type == 'close') {
	    uni.$u.route({
	      type: 'back',
	      delta: 1
	    });
	    return;
	  }
	  if (e.type == 'menu' && !this.publishButoonDisable) {
	    this.isMore = !this.isMore;
	  }
	},
  components: {},
  computed: {
  },
  methods: {
    getList() {
      let that = this;
      that.$http.get('/msg/system/list/data').then(res => {
				res = this.getTypeList(res)
        for (let i = 0; i < res[this.notifyType].length; i++) {
                let type = res[this.notifyType][i].Type || 0;
                let bizType = res[this.notifyType][i].BizType || 0;
                let content = res[this.notifyType][i].Content;
                if (that.$t('chat.msg_title_'+ bizType) !== undefined) {
                  res[this.notifyType][i].Title = that.$t('chat.msg_title_'+ bizType);
                }
								console.log(bizType)
                if (that.$t('chat.msg_content_'+ bizType) !== undefined && bizType != 16 && bizType != 31 & type != 2 && bizType != 32 && bizType != 33) {
                  //let number = res[i].Content.replace(/[^0-9]/ig, "");
                  
									let number = (res[this.notifyType][i].Content.match(/\d+个工程/g)+"").match(/\d+/g);
                  content = that.$t('chat.msg_content_'+ bizType);
                  if (uni.getStorageSync('lang') == '中文') {
                    content = content.replace('[projectName]', res[this.notifyType][i].ProjectName)
                  } else {
                    content = content.replace('[projectName]', res[this.notifyType][i].ShipName)
                  }
                  content = content.replace('[userName]', res[this.notifyType][i].ExtDataJson.AddAccName || '')
                  content = content.replace('[number]', number)
                  res[this.notifyType][i].Content = content;
                }
                
                //确认结果状态，2：确认、3：驳回
                let stat =res[this.notifyType][i].ExtDataJson.Stat || 0;
                //alert(res[i].ExtDataJson.stat+"-----"+stat);
                if (stat == 3) {
                  let rejectRmk = res[this.notifyType][i].ExtDataJson.RejectRmk || '';
                  if (rejectRmk != '') {
                    content = content.replace('[rejectRmk]', rejectRmk)
                    res[this.notifyType][i].Content = content;
                  }
                } else if (stat == 2) {								
                  if (that.$t('chat.msg_content_'+ bizType + '_confirm') !== undefined) {
                    //let number = res[i].Content.replace(/[^0-9]/ig, "");
                    let number = (res[this.notifyType][i].Content.match(/\d+个工程/g)+"").match(/\d+/g);
                    let content = that.$t('chat.msg_content_'+ bizType + '_confirm');
                    if (uni.getStorageSync('lang') == '中文') {
                      content = content.replace('[projectName]', res[this.notifyType][i].ProjectName)
                    } else {
                      content = content.replace('[projectName]', res[this.notifyType][i].ShipName)
                    }
										content = content.replace('[userName]', res[this.notifyType][i].ExtDataJson.AddAccName || '')
                    content = content.replace('[number]', number)
                    res[this.notifyType][i].Content = content;
                  }
                }
							 //修理单结果通知
								if(bizType == 16) {
									let amount = res[this.notifyType][i].Content.slice(res[this.notifyType][i].Content.indexOf('为') + 1,res[this.notifyType][i].Content.indexOf('详')-1)
									let content = that.$t('chat.msg_content_16');
							
									if (uni.getStorageSync('lang') == '中文') {
									  content = content.replace('[projectName]', res[this.notifyType][i].ProjectName)
									} else {
									  content = content.replace('[projectName]', res[this.notifyType][i].ShipName)
									}
									content = content.replace('[amount]',amount)
									res[this.notifyType][i].Content = content;							
								 }
								 //好友@通知
								if(res[this.notifyType][i].Title == '好友@通知'){
									let username = res[this.notifyType][i].Content.slice(res[this.notifyType][i].Content.indexOf('友')+1,res[this.notifyType][i].Content.indexOf('在'))
								
									res[this.notifyType][i].Title = that.$t('chat.msg_@_notify');
									let content = that.$t('chat.msg_content_@')
							
									content = content.replace('[userName]', username)
									res[this.notifyType][i].Content = content
								}
								//好友关注
								if(bizType == 31) {
									let username = res[this.notifyType][i].Content.slice(0,res[this.notifyType][i].Content.indexOf('关'))
									let content = that.$t('chat.msg_content_31');
									content = content.replace('[userName]',username)
									res[this.notifyType][i].Content = content;							
								 }
								 if(bizType == 32) {
									 let username = res[this.notifyType][i].Content.slice(0,res[this.notifyType][i].Content.indexOf('评'))
									 let content = that.$t('chat.msg_content_32');
									 content = content.replace('[userName]',username)
									 res[this.notifyType][i].Content = content;			
								 }
								 //发布文章，所有粉丝发送消息至铃铛
								 if(bizType == 33) {
								 	let username = res[this.notifyType][i].Content.slice(4,res[this.notifyType][i].Content.indexOf('发'))
								 	let content = that.$t('chat.msg_content_33');
								 	content = content.replace('[userName]',username)
								 	res[this.notifyType][i].Content = content;			
								 }
                }
                that.list = res[this.notifyType]
								console.log(that.list)
      })
    },
    cancelModal() {
      this.isMore = false;
    },
    actRead() {
      this.isMore = false;
      this.isReaded = false;
      this.$http.get('/msg/system/read',{msgType: this.notifyType,type :1}).then(res => {
        this.getList()
      })
    },
    actDelete() {
      this.isMore = false;
      this.isDeleted = false;
      this.$http.get('/msg/system/deleteNew', {msgType: this.notifyType,type :1}).then(res => {
        this.getList();
      })
    },
		getTypeList(list) {
			var data = {
				0: [],
				1: [],
				2: []
			}
			list.forEach(item=> {
				if(item.BizType >=11 && item.BizType <= 15 ) {
					data[0].push(item)
				}else if(item.BizType == 16) {
					data[1].push(item)
				}
				else if(item.BizType == 33 || item.BizType == 31 || item.BizType == 32 || item.BizType == 0 && item.Title != '需求指派通知') {
					data[2].push(item)
				}else{}
			})
			return data
		}
  }
}
</script>

<style lang="scss" scoped>
.note {
  position: relative;
  padding: 20rpx 30rpx;

  &-item {
    background-color: #fff;
    padding: 20rpx;
    margin-bottom: 20rpx;
    border-radius: 10rpx;

    &_header {
      font-size: 30rpx;
      color: #131313;
      padding-bottom: 20rpx;
      border-bottom: 1rpx solid rgba(210, 210, 210, .5);

      .note-state {
        position: relative;
        margin-right: 15rpx;
        color: #7F7F7F;
      }
    }

    &_title {
      margin-right: 6rpx;
    }

    &_txt {
      margin: 34rpx 0;
      font-size: 28rpx;
      color: #666666;
      line-height: 44rpx;
    }

    &_time {
      text-align: right;
      font-size: 26rpx;
      color: #666666;
      margin-bottom: 10rpx;
    }
  }

  .note-item.read {
    opacity: .5;

    .u-badge {
      display: none;
    }
  }

  .more-action {
    z-index: 9999;
    position: fixed;
    right: 20rpx;
    top: 16rpx;
    padding: 20rpx 30rpx;
    background: #313131;
    border-radius: 10rpx;

    &_item {
      font-size: 30rpx;
      color: #FFFFFF;
      line-height: 2;
    }

    &::after {
      position: absolute;
      top: -15rpx;
      right: 24rpx;
      content: '';
      width: 0;
      height: 0;
      border-left: 12rpx solid transparent;
      border-right: 12rpx solid transparent;
      border-bottom: 16rpx solid #313131;
    }
  }
}
</style>
